<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>联系我们</title>
    <link rel="shortcut icon" href="../favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="../css/contact.css">
    <link rel="stylesheet" href="../font/iconfont.css">

    <link rel="stylesheet" href="https://at.alicdn.com/t/font_3251130_v0dn727ty5j.css">
    <script type="text/javascript"
        src="https://api.map.baidu.com/api?v=3.0&ak=Uh991n2UMG1qKWcERbGd7QkBkLh11V1D"></script>

</head>

<body>
    <div class="container">

        <!-- 右边：右导航栏 (公共部分)-->
        <aside>
            <div class="subnav">
                <!-- 关闭按钮 -->
                <a href="javascript:;" class="offbtn iconfont icon-xuanxiangqiaguanbianniu"></a>
                <ul class="nav-list">
                    <li><a href="../index.html">首页</a></li>
                    <li><a href="about_us.html">了解我们</a></li>
                    <li><a href="case_sharing.html">案列分享</a></li>
                    <li><a href="">精装服务</a></li>
                    <li><a href="">优质产品</a></li>
                    <li><a href="news_dyn.html">公司动态</a></li>
                    <li><a class="show" href="contact_us.html">找我们聊聊</a></li>
                </ul>

            </div>
        </aside>
        <!-- 头部 菜单栏 banner (公共部分)-->
        <header>
            <div class="bannar">
                <div class="topbar">
                    <div class="topbar-flex wrapper">
                        <div class="logo">
                            <a href="../index.html">
                                <img src="../images/index-toplogo.png" alt="">
                            </a>
                        </div>
                        <div class="menubtn">
                            <a href="javascript:;"><i class="iconfont icon-caidan1"></i></a>
                        </div>
                    </div>
                </div>
                <ul class="slides">
                    <li class="slide"><img src="../images/index-banner.png" alt=""></li>
                    <li class="slide"><img src="../images/aboutus-banner.png" alt=""></li>
                    <li class="slide"><img src="../images/caseshare-banner-1.png" alt=""></li>
                </ul>
            </div>
        </header>


        <!-- 联系我们 内容部分 -->
        <main>
            <div class="contact">
                <div class=" title">
                    <h4>联系方式</h4>
                    <span class="tag">CONTACT US</span>
                </div>
                <div class="scan">
                    <div class="scan-flex wrapper">
                        <div class="picbox">
                            <img src="../images/contactus-1.png" alt="">
                        </div>
                        <div class="qr-code">
                            <p class="line">扫微信二维码
                                <span class="line-left"></span>
                                <span class="line-right"></span>
                            </p>
                            <p>添加<a href="../index.html">熊管家</a>微信咨询</p>
                        </div>
                    </div>
                </div>
                <div class="contact-content">
                    <ul class="wrapper">

                        <li>地址 ： 成都市温江区珠江广场写字楼15楼</li>
                        <li>电话 ： 028-82708866</li>
                        <li>手机 ： 13558833169</li>
                        <li>Q&nbsp;Q&nbsp;： 123456789</li>
                        <!-- <li><i>地址 </i> <span> ： 成都市温江区珠江广场写字楼15楼</span></li> -->
                        <!-- <li><i>电话 </i> <span> ： 028-82708866</span></li> -->
                        <!-- <li><i>手机 </i> <span> ： 13558833169</span></li> -->
                        <!-- <li><i> Q Q </i> <span> ： 123456789</span></li> -->
                        <li>09:00 AM ~ 06:00 PM，周末照常上班</li>
                    </ul>
                </div>

                <div class="appoint wrapper">
                    <h4>请客户顾问联系我
                        <span class="line-left"></span>
                        <span class="line-right"></span>
                    </h4>

                    <form action="">
                        <ul class="info-list">
                            <li>
                                <span><i>*</i>您的姓名</span><input type="text" value="" placeholder="请填写您的姓名">
                            </li>
                            <li>
                                <span><i>*</i>手机号码</span><input type="text" value="" placeholder="填写你的手机号">
                            </li>
                            <li>
                                <span>建筑面积</span><input type="text" value="" placeholder="选填">
                            </li>
                            <li>
                                <span>致电时间</span>
                                <select name="" id="">
                                    <option value="">上午</option>
                                    <option value="">中午</option>
                                    <option value="">下午</option>
                                </select>

                            </li>
                            <a href="javascript:;">立即预约</a>

                        </ul>
                    </form>
                </div>
                <!-- <div class="map"><img src="images/contactus-2.png" alt=""></div> -->
                <!-- 引用百度地图  -->
                <div id="allmap">
                    <!-- <div class="map"></div> -->
                </div>
            </div>

        </main>
        <!-- 页脚(公共部分) -->
        <footer>
            <div class="wrapper">

                <!-- 页脚顶部 -->
                <div class="foot-top">
                    <div class="foot-contact">
                        <div class="foot-logo"><img src="../images/index-footerlogo.png" alt=""></div>
                        <span class="tel-phone"><i class="iconfont icon-phone03"></i>028-82708866 / 13558833169</span>
                    </div>
                    <div class="footer-service">
                        <ul class="footer-service-list">
                            <li><i class="iconfont icon-zhuye"></i>成都熊管家装饰装修有限公司</li>
                            <li><i class="iconfont icon-dingwei-"></i>地址：成都市温江区珠江广场写字楼15楼</li>
                            <li><i class="iconfont icon-phone03"></i>联系电话：028-82708866（座机）/13558833169</li>
                            <li><i class="iconfont icon-mail"></i>E-mail：admian@admin.com</li>
                        </ul>
                    </div>
                </div>
            </div>


            <!-- 快速导航部分 -->
            <div class="quicknav">
                <div class="wrapper">
                    <h4>快速导航</h4>
                    <ul>
                        <li><a href="about_us.html">了解我们</a></li>
                        <li><span>/</span></li>
                        <li><a href="case_sharing.html">案列分享</a></li>
                        <li><span>/</span></li>
                        <li><a href="">精装服务</a></li>
                        <li><a href="">优质产品</a></li>
                        <li><span>/</span></li>
                        <li><a href="news_dyn.html">公司动态</a></li>
                        <li><span>/</span></li>
                        <li><a href="contact_us.html">联系我们</a></li>
                    </ul>
                    <div class="footerpic">
                        <img src="../images/footer-font.png" alt="">
                    </div>


                </div>
            </div>
            <!-- 快捷入口部分 -->
            <div class="quick-entry">
                <div class="wrapper">
                    <h4>快捷入口</h4>
                    <ul>
                        <li><a href=""><i class="iconfont icon-weixin1"></i></a></li>
                        <li><a href=""><i class="iconfont icon-weibo"></i></a></li>
                        <li><a href=""><i class="iconfont icon-a-shenghuodazhongdianping"></i></a></li>
                        <li><a href=""><i class="iconfont icon-douyin1"></i></a></li>
                        <li><a href=""><i class="iconfont"></i></a></li>
                        <li><a href=""><i class="iconfont"></i></a></li>

                    </ul>
                    <p><a href="../index.html">互联网家装引领者</a></p>
                </div>
            </div>
            <!-- 版权部分 -->
            <div class="copyright">
                <div class="wrapper">
                    <p>Copyright ©2015-2019 成都熊管家装饰装修有限公司 版权所有</p>
                </div>
            </div>
    </div>
    </footer>
    <script src="../js/flexible.js"></script>
    <script src="../js/common.js"></script>
    <script type="text/javascript">
        // 百度地图API功能
        //创建地图实例
        var map = new BMap.Map("allmap");
        // 设置中心坐标点
        var point = new BMap.Point(103.87066608348736, 30.692211831152697);
        // 初始化地图，设置中心点坐标和地图级别 （3—19）
        map.centerAndZoom(point, 16);

        // map.enableScrollWheelZoom(true);
        //启用滚轮放大缩小，默认禁用
        // map.enableScrollWheelZoom();
        //启用地图惯性拖拽，默认禁用
        // map.enableContinuousZoom(true);
        //添加默认缩放平移控件
        // map.addControl(new BMap.NavigationControl());


        // var marker = new BMap.Marker(point);  // 创建标注
        // map.addOverlay(marker);               // 将标注添加到地图中
        // marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
        // 更改标注图标(自定义图标)
        var myIcon = new BMap.Icon("../images/map-marker.png", new BMap.Size(23, 25));
        var marker = new BMap.Marker(point, { icon: myIcon });  // 创建标注
        map.addOverlay(marker); //将标注加到地图中


        //监听事件
        // maeker.addEventListener("click", function () {
        //     alert("您点击了标注");
        // });

        // 添加信息窗口
        var opts = {
            width: 100,     // 信息窗口宽度
            height: 20,     // 信息窗口高度
            title: ""  // 信息窗口标题
        };
        //infoWindow:信息窗口对象
        // 创建信息窗口对象
        var content = '<div style="font-size:12px;color:#333;"><h4 style="font-size:15px;margin-bottom:20px">熊管家装饰装修有限公司</h4><p>地址：成都市温江区珠江广场写字楼15楼</p></div>';
        var infoWindow = new BMap.InfoWindow(content, opts);
        // map.openInfoWindow(infoWindow, map.getCenter()); //开启信息窗口，getCenter()获取地图中心点
        map.openInfoWindow(infoWindow, point); //开启 信息窗口，point为标注的位置
        //点击marker
        marker.addEventListener("click", function () {
            // map.openInfoWindow(infoWindow, map.getCenter()); //开启信息窗口
            map.openInfoWindow(infoWindow, point); //开启 信息窗口，point为标注的位置
        });
    </script>
    <!-- <script>
        //创建Map地图实例
        var map = new BMap.Map("allmap");
        //设置中心点坐标--固定的位置--孵化园E座
        var point = new BMap.Point(104.066443, 30.57935);
        //map.enableScrollWheelZoom(true);
        //启用滚轮放大缩小，默认禁用
        map.enableScrollWheelZoom();
        //启用地图惯性拖拽，默认禁用
        map.enableContinuousZoom();
        map.centerAndZoom(point, 15);
        //添加默认缩放平移控件
        map.addControl(new BMap.NavigationControl());
        //单独设定图标的样式
        var icon = new BMap.Icon('images/contactus-1.png', new BMap.Size(20, 32), {
            anchor: new BMap.Size(10, 30)
        });
        var marker = new BMap.Marker(new BMap.Point(116.498752, 39.900157), {
            icon: icon
        });
        // 创建标注
        //var marker = new BMap.Marker(point);
        // 将标注添加到地图中
        map.addOverlay(marker);
        //跳动的动画
        marker.setAnimation(BMAP_ANIMATION_BOUNCE);
        //创建信息窗口
        var sContent = "<div class='myclass'>公司:江尊少网络科技 <br>地址:北京市朝阳区广渠路21号金海国际B208<br>手机：182-1060-5516<br><img src='http://app.baidu.com/map/images/tiananmen.jpg'></div>";
        // 创建信息窗口对象
        var infoWindow = new BMap.InfoWindow(sContent);
        map.centerAndZoom(point, 15);
        //标注点添加到页面
        map.addOverlay(marker);
        //点击事件监听
        marker.addEventListener("click", function () {
            this.openInfoWindow(infoWindow);
            //图片加载完毕重绘infowindow
            document.getElementById('imgDemo').onload = function () {
                infoWindow.redraw();
            }
        });


    </script> -->

</body>

</html>